<template>
  <p>输入框</p>
  <CustomInput
    v-model="inputValue"
    label="Name"
    placeholder="Enter your name"
  />
  <p>你的输入: {{ inputValue }}</p>
  <p>选择框</p>
  <CustomSelect
    v-model="selectedOption"
    :options="selectOptions"
    @change="handleSelectChange"
  />
</template>

<script setup>
import { onMounted, ref } from "vue";
import CustomInput from "@/components/myComponent/myComponent.vue";
import CustomSelect from "@/components/myComponent/select.vue";

// 定义输入值
const inputValue = ref("");

const selectedOption = ref(null);
const selectOptions = ref([
  { value: 'option1', label: 'Option 1' },
  { value: 'option2', label: 'Option 2' },
  { value: 'option3', label: 'Option 3' }
]);

const handleSelectChange = (value) => {
  console.log('Selected Value:', value);
};
</script>

<style></style>
